import Vue from 'vue'
// 引入初始化样式文件
import 'normalize.css/normalize.css' // A modern alternative to CSS resets
// 引入ElementUI相关资源
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
// import locale from 'element-ui/lib/locale/lang/en' // lang i18n
// 引入当前项目全局的样式文件
import '@/styles/index.scss' // global css
// 引入跟组件
import App from './App'
// 引入vuex实例
import store from './store'
// 引入路由实例
import router from './router'
// 引入icon图标
import '@/icons' // icon
// 引入权限控制 -> 路由守卫
import '@/permission' // permission control

// 全局组件
import components from './components'
Vue.use(components)

// 注册ElementUI并配置语言包
// Vue.use(ElementUI, { locale })
// 如果想要中文版 element-ui，按如下方式声明
Vue.use(ElementUI)

// 自定义指令 -> 通过指令实现按钮级控制
// Vue.directive('自定义指令名称',{'相关配置'})
Vue.directive('allow', {
  inserted(el, binding) {
    console.log('当前绑定的dom元素', el)
    console.log('当前绑定的dom元素相关信息', binding)
    // 获取用户的权限信息
    const points = store.state.user.userInfo.roles.points
    // 判断接收过来的值是否在权限的数组中 存在显示 不存在删除当前元素
    if (!points.includes(binding.value)) {
      console.log('判断这个元素是否会显示', el, binding.value)
      el.remove()
    }
  }
})
// 多语言
import i18n from '@/lang'
Vue.config.productionTip = false
// 挂载
new Vue({
  el: '#app',
  router, // this.$router
  store, // this.$store
  i18n, // this.$t
  render: h => h(App)
})

